<template>
  <div class="searchCommunity">
    <van-nav-bar
      left-arrow
      @click-left="onClickLeft"
      fixed
      title="小区搜索结果"
    />
    <h2>{{$route.params.value}}</h2>
    <div v-if="isShow">
      <van-cell-group v-for="(item) in communityList" :key="item.id">
      <van-cell :title="item.areaName" :value="item.communityName"  @click="$router.push(`/addHouse?name=${item.communityName}`)"/>
    </van-cell-group>
    </div>
    <h2 v-else>宝贝,没有搜索到哦~~~</h2>
  </div>
</template>

<script>
import { searchCity } from '@/api/city'
import { getCommunityInfo } from '@/api/community'
import { getHouseInfo } from '@/api/house'
export default {
  name: 'search-community',
  data () {
    return {
      name: '',
      id: '',
      communityList: [],
      isShow: true
    }
  },
  methods: {
    onClickLeft () {
      this.$router.back()
    }
  },
  async created () {
    const communityName = this.$route.params.value
    const res = await searchCity(communityName)
    console.log(res)
    if (communityName !== res.body.label) {
      this.isShow = false
    } else {
      this.name = res.body.label
      this.id = res.body.value
    }

    const res1 = await getCommunityInfo(this.name, this.id)
    console.log(res1)
    this.communityList = res1.body

    const res2 = await getHouseInfo(this.id)
    console.log(res2)
  }
}
</script>

<style lang="less" scoped>
.searchCommunity {
  margin-top: 50px;
  h2 {
    text-align: center;
  }
}
</style>
